import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:read_flutter/common/BookUtils.dart';
import 'package:read_flutter/common/Models.dart';
import 'package:scoped_model/scoped_model.dart';
import 'package:read_flutter/pages/read_page.dart';
import 'package:read_flutter/common/CustomRoute.dart';
import 'package:read_flutter/pages/bookInfo_page.dart';
import 'package:package_info/package_info.dart';

class BookShelf_Page extends StatefulWidget {
  @override
  _BookShelf_PageState createState() => _BookShelf_PageState();
}

class _BookShelf_PageState extends State<BookShelf_Page> {
  @override
  initState() {
    super.initState();
    setup();
  }

  String version = "正在获取";

  setup() async {
    final model = ScopedModel.of<ReadApiModels>(context);
    await model.setupModels();
    //获取版本号
    PackageInfo packageInfo = await PackageInfo.fromPlatform();
    version = packageInfo.version;
    print("version" + version);
  }

  //侧边栏
  Widget drawerWidget() {
    return Drawer(
        child: Container(
      child: Column(
        children: <Widget>[
          drawerHeader(),
          Expanded(
              child: Container(
            child: ListView(
              padding: EdgeInsets.symmetric(vertical: 0.0),
              children: <Widget>[
                GestureDetector(
                  child: Container(
                    padding: EdgeInsets.only(left: 10),
                    height: 50,
                    alignment: Alignment.centerLeft,
                    decoration: BoxDecoration(
                        border: Border(
                            bottom:
                                BorderSide(color: Colors.black12, width: 1.0))),
                    width: double.infinity,
                    child: Text(
                      "用户信息",
                      style: TextStyle(fontSize: 18.0),
                    ),
                  ),
                  onTap: () {},
                ),
                GestureDetector(
                  child: Container(
                    padding: EdgeInsets.only(left: 10),
                    height: 50,
                    alignment: Alignment.centerLeft,
                    decoration: BoxDecoration(
                        border: Border(
                            bottom:
                                BorderSide(color: Colors.black12, width: 1.0))),
                    width: double.infinity,
                    child: Text(
                      "版本号：" + version,
                      style: TextStyle(fontSize: 18.0),
                    ),
                  ),
                  onTap: () {},
                ),
              ],
            ),
          ))
        ],
      ),
    ));
  }

  //侧边栏头
  Widget drawerHeader() {
    return GestureDetector(
      child: Container(
        width: double.infinity,
        height: 200.0,
        color: Colors.lightBlue,
        padding:
            EdgeInsets.only(top: 100.0, left: 15.0, right: 10.0, bottom: 10.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.end,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Text(
              "请登录",
              style: TextStyle(color: Colors.white, fontSize: 20.0),
            ),
            Text(
              "",
              style: TextStyle(color: Colors.white, fontSize: 13.0),
            )
          ],
        ),
      ),
      onTap: () {},
    );
  }

  //书架
  Widget shelfWidget(List<BookInfo> books) {
    List<Widget> booksWidget = [];
    for (BookInfo info in books) {
      booksWidget.add(bookInfoWidget(info));
    }
    return Container(
      width: double.infinity,
      height: double.infinity,
      padding: EdgeInsets.symmetric(vertical: 5, horizontal: 5),
      child: SingleChildScrollView(
          child: Center(
              child: Container(
        width: double.infinity,
        child: Wrap(
          crossAxisAlignment: WrapCrossAlignment.center,
          spacing: 5,
          children: booksWidget,
        ),
      ))),
    );
  }

  //书Widget
  Widget bookInfoWidget(BookInfo book) {
    return GestureDetector(
      child: Card(
        clipBehavior: Clip.none,
        elevation: 2,
        margin: EdgeInsets.symmetric(horizontal: 10, vertical: 5),
        child: Column(
          children: <Widget>[
            Container(
              child: Image(
                image: CachedNetworkImageProvider(book.imagelink),
                fit: BoxFit.contain,
                width: ScreenUtil().setWidth(200),
                height: ScreenUtil().setWidth(275),
              ),
            ),
            Container(
              child: Text(
                book.showname,
                style: TextStyle(fontSize: 15),
              ),
            )
          ],
        ),
      ),
      onTap: () async {
        Navigator.of(context).push(MaterialPageRoute(builder: (_) {
          return BookInfoPage(book);
        }));
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    ScreenUtil.instance = ScreenUtil(width: 750, height: 1334)..init(context);

    return ScopedModelDescendant<ReadApiModels>(
        builder: (context, child, model) {
      return Scaffold(
        appBar: AppBar(
          title: Text("书架"),
          actions: <Widget>[
            IconButton(
                icon: Icon(Icons.search),
                onPressed: () {
                  Navigator.of(context).pushNamed('/SEARCH');
                })
          ],
        ),
        drawer: drawerWidget(),
        body: Container(child: shelfWidget(model.books)),
      );
    });
  }
}
